<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	  <title>deui_flex_grid</title>
    <link rel="stylesheet" type="text/css" href="../../css/deui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/grid/deui-flex-grid.css" />
    <link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_1065498_ejbpdcneqqm.css" />

</head>
<body>

  <div>分两份</div>
  <div class="deui-flex-row">
    <div class="deui-flex-col-6">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-6</div>
    </div>
    <div class="deui-flex-col-6">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-6</div>
    </div>
  </div>

  <div>分三份</div>
  <div class="deui-flex-row">
    <div class="deui-flex-col-4">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-4</div>
    </div>
    <div class="deui-flex-col-4">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-4</div>
    </div>
    <div class="deui-flex-col-4">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-4</div>
    </div>
  </div>

  <div>分四份</div>
  <div class="deui-flex-row">
    <div class="deui-flex-col-3">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-3</div>
    </div>
    <div class="deui-flex-col-3">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-3</div>
    </div>
    <div class="deui-flex-col-3">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-3</div>
    </div>
    <div class="deui-flex-col-3">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-3</div>
    </div>
  </div>

  <div>分五份</div>
  <div class="deui-flex-row">
    <div class="deui-flex-col-5">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-5</div>
    </div>
    <div class="deui-flex-col-5">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-5</div>
    </div>
    <div class="deui-flex-col-5">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-5</div>
    </div>
    <div class="deui-flex-col-5">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-5</div>
    </div>
    <div class="deui-flex-col-5">
      <i class="deui_iconfont iconshoucang"></i>
      <div>deui-flex-col-5</div>
    </div>
  </div>

<div>任意增加</div>
<div class="deui-flex-row">
  <div class="deui-flex-col">
    首页
  </div>
  <div class="deui-flex-col">
    消息
  </div>
  <div class="deui-flex-col">
    个人中心
  </div>
  <div class="deui-flex-col">
    首页
  </div>
  <div class="deui-flex-col">
    首页
  </div>
  <div class="deui-flex-col">
    首页
  </div>
  <div class="deui-flex-col">
    首页
  </div>
  <div class="deui-flex-col">
    消息
  </div>
  <div class="deui-flex-col">
    个人中心
  </div>
  <div class="deui-flex-col">
    消息
  </div>
  <div class="deui-flex-col">
    个人中心
  </div>
  <div class="deui-flex-col">
    消息
  </div>
  <div class="deui-flex-col">
    个人中心
  </div>
</div>






</body>
</html>
